<template>
	<view>
		<view class="box">
			<view class="top">
				日常工作
			</view>
			<view class="bottom">
				<view class="classlist" v-for="(item,index) in routinelist" :key="index" @click="routineclick(index)">
					<view class="image">
						<image :src="item.image"></image>
					</view>
					<text>{{item.name}}</text>
				</view>
			</view>
		</view>
		<view class="box">
			<view class="top">
				业绩统计
			</view>
			<view class="bottom">
				<view class="classlist" v-for="(item,index) in statisticslist" :key="index" @click="statisticsclick(index)">
					<view class="image">
						<image :src="item.image"></image>
					</view>
					<text>{{item.name}}</text>
				</view>
			</view>
		</view>
		<view class="box">
			<view class="top">
				运营推广
			</view>
			<view class="bottom">
				<view class="classlist" v-for="(item,index) in promotionlist" :key="index" @click="promotionclick(index)">
					<view class="image">
						<image :src="item.image"></image>
					</view>
					<text>{{item.name}}</text>
				</view>
			</view>
		</view>
		<view class="box">
			<view class="top">
				其他
			</view>
			<view class="bottom">
				<view class="classlist" v-for="(item,index) in otherlist" :key="index" @click="otherclick(index)">
					<view class="image">
						<image :src="item.image"></image>
					</view>
					<text>{{item.name}}</text>
				</view>
			</view>
		</view>

		<view class="tabbar">
		</view>
		<tabBar :pagePath="'/pagesC/my/my'" :type='type'></tabBar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type: 3,
				routinelist: [{
					name: "预约",
					image:"../../static/black.jpg"
				},{
					name: "顾客",
					image:"../../static/black.jpg"
				},{
					name: "考勤管理",
					image:"../../static/black.jpg"
				},{
					name: "服务",
					image:"../../static/black.jpg"
				},{
					name: "技师",
					image:"../../static/black.jpg"
				},{
					name: "目标",
					image:"../../static/black.jpg"
				}], //日常工作
				statisticslist:[{
					name: "排行榜",
					image:"../../static/black.jpg"
				},{
					name: "数据",
					image:"../../static/black.jpg"
				},{
					name: "运营报表",
					image:"../../static/black.jpg"
				},{
					name: "商城",
					image:"../../static/black.jpg"
				}],//业绩统计
				promotionlist:[{
					name: "推广收益",
					image:"../../static/black.jpg"
				},{
					name: "营销",
					image:"../../static/black.jpg"
				}],//运营推广
				otherlist:[{
					name: "门店管理",
					image:"../../static/black.jpg"
				},{
					name: "代收代付",
					image:"../../static/black.jpg"
				},{
					name: "工资标准",
					image:"../../static/black.jpg"
				}],//其他
			}
		},
		methods: {
			//其他
			otherclick(index){
				if(index == 0){
					//门店管理
					uni.navigateTo({
						url:"../storesoperation/storesoperation"
					})
				}else if(index==1){
					
				}else if(index==2){
					//薪资标准
					uni.navigateTo({
						url:"../salarystandard/salarystandard"
					})
				}
			},
			//运营推广
			promotionclick(index){
				if(index == 0){
					//推广收益
					uni.navigateTo({
						url:"../extension/extension"
					})
				}else if(index==1){
					//顾客
					uni.navigateTo({
						url:"../operate/operate"
					})
				}
			},
			//业绩统计
			statisticsclick(index){
				if(index == 0){
					//排行榜
					uni.navigateTo({
						url:"../ranking/ranking"
					})
				}else if(index==1){
					//顾客
					uni.navigateTo({
						url:"../chart/chart"
					})
				}
			},
			//日产工作
			routineclick(index){
				if(index==0){
					//预约
					uni.navigateTo({
						url:"../advance/advance"
					})
				}else if(index==1){
					//顾客
					uni.navigateTo({
						url:"../member/member"
					})
				}else if(index==2){
					//考勤管理
					uni.navigateTo({
						url:"../attendance/attendance"
					})
				}else if(index==3){
					//服务
					uni.navigateTo({
						url:"../projectlist/projectlist"
					})
				}else if(index==4){
					//技师
					uni.navigateTo({
						url:"../technicianlist/technicianlist"
					})
				}
			},
		}
	}
</script>

<style lang="scss">
	image {
		width: 100%;
		height: 100%;
	}

	.box {
		padding: 20rpx;

		.top {
			width: 100%;
			font-size: 28rpx;
			color: #000000;
			padding: 10rpx 0;
			border-bottom: 1rpx solid #ECECEC;
		}

		.bottom {
			display: flex;
			align-items: center;
			flex-wrap: wrap;

			.classlist {
				flex: 0 0 25%;
				text-align: center;
				margin: 20rpx 0;

				.image {
					width: 100rpx;
					height: 100rpx;
					margin: 0 auto;
				}

				text {
					font-size: 26rpx;
					color: #C8C7CC;
					margin: 10rpx 0;
				}
			}
		}
	}

	.tabbar {
		width: 750rpx;
		height: 100rpx;
	}
</style>
